<template>
  <el-dialog :title="isEdit?'编辑车辆管理':'新增车辆管理'"
             :visible.sync="dialogForm"
             width="780px">
    <el-form :inline="true"
             ref="form"
             :model="form"
             :rules="rules"
             class="add-form"
             label-width="110px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="车号"
                        prop="resourceNo">
            <el-input v-model="form.resourceNo"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="车牌号"
                        prop="plateNumber">
            <el-input v-model="form.plateNumber"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="车辆类型"
                        prop="typeName">
            <auto-search-dic @select="handleCllx"
                             @selectName="v=>form.typeName=v"
                             @selectId="v=>form.typeId=v"
                             :name="form.typeName"
                             code="JOB_CLLX"></auto-search-dic>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="车辆类别"
                        prop="categoryName">
            <auto-search-dic @select="v=>form.categoryCode=v"
                             @selectId="v=>form.categoryId=v"
                             @selectName="v=>form.categoryName=v"
                             :name="form.categoryName"
                             code="JOB_CLLB"></auto-search-dic>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="所属单位"
                        prop="orgId">
            <auto-search-org v-model="form.orgId"
                             @select="v=>{form.orgId=v;form.deptId='';form.deptName=''}"
                             @selectName="v=>form.orgName=v"
                             :disabled="true"
                             :name="form.orgName"></auto-search-org>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="所属车队公司"
                        prop="carTeamCode">
            <auto-search-dic v-model="form.carTeamCode"
                             @select="v=>form.carTeamCode=v"
                             @selectName="v=>form.carTeamName=v"
                             :name="form.carTeamName"
                             code="JOB_CDGS"></auto-search-dic>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="车重(吨)"
                        prop="weight">
            <el-input v-model.number="form.weight"
                      type="number"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="载重(吨)"
                        prop="loadNum">
            <el-input v-model.number="form.loadNum"
                      type="number"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="对接终端"
                        prop="terminalName">
            <auto-search-ter v-model="form.terminalName"
                             @select="v=>form.terminalName=v"
                             @selectId="v=>form.terminalId=v"
                             :deptId="form.deptId"
                             :disabled="!form.deptId"
                             :name="form.terminalName"></auto-search-ter>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="可拖标箱数"
                        :prop="form.typeCode!=='JOB_CLLX_HC'?'teu':''">
            <el-input-number style="width: 188px"
                             :min="1"
                             :max="2"
                             v-model="form.teu"
                             v-if="form.typeCode!=='JOB_CLLX_HC'"></el-input-number>
            <el-input v-model="form.teu"
                      v-if="form.typeCode==='JOB_CLLX_HC'"
                      :disabled="true"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="是否可用"
                        prop="valid">
            <el-radio v-model="form.valid"
                      :label="true">是</el-radio>
            <el-radio v-model="form.valid"
                      :label="false">否</el-radio>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="备注"
                        prop="resourceDescribe">
            <el-input type="textarea"
                      :rows="3"
                      style="width: 560px"
                      placeholder="请输入内容"
                      :maxLength="$maxLength"
                      v-model="form.resourceDescribe"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer"
         class="dialog-footer">
      <el-button @click="dialogForm = false">取 消</el-button>
      <el-button type="primary"
                 @click="handleSubmit"
                 :loading="$store.getters.loadingBtn">保 存</el-button>
    </div>
  </el-dialog>
</template>

<script>
import {
  addJobVehicle,
  updateJobVehicle
} from '@/api/baseResource/baseResource'
import autoSearchOrg from '@/components/autocomplete/autoSearchOrg'
import autoSearchDic from '@/components/autocomplete/autoSearchDic'
import autoSearchTer from '@/components/autocomplete/autoSearchTer'
import searchDept from '@/components/autocomplete/autoSearchDept'
import { maxLength, sortLength } from '@/utils/rules'
import { PUBLIC_LIMIT, REG_ALL_NUMBER, PUBLIC_NUMBER_NULL } from '@/utils/Reg'
export default {
  name: 'roleForm',
  components: { autoSearchOrg, searchDept, autoSearchDic, autoSearchTer },
  data() {
    return {
      form: this.clearForm(),
      rules: {
        resourceNo: [
          { required: true, validator: PUBLIC_LIMIT, trigger: 'blur' },
          sortLength
        ],
        plateNumber: [
          { required: true, validator: PUBLIC_LIMIT, trigger: 'blur' },
          sortLength
        ],
        typeName: [
          { required: true, message: '请输入车辆类型', trigger: 'blur' },
          sortLength
        ],
        weight: [{ validator: PUBLIC_NUMBER_NULL, trigger: 'blur' }],
        loadNum: [{ validator: PUBLIC_NUMBER_NULL, trigger: 'blur' }],
        categoryName: [
          { required: true, message: '请输入车辆类别', trigger: 'blur' },
          sortLength
        ],
        teu: [{ required: true, message: '请输入可拖标箱数', trigger: 'blur' }],
        // terminalName: [{ required: true, message:'请选择对接终端', trigger: 'blur' },sortLength],
        orgId: [{ required: true, message: '请选择单位', trigger: 'change' }],
        code: [{ required: true, message: '请选择部门', trigger: 'change' }],
        resourceDescribe: [maxLength]
      },
      dialogForm: false,
      isEdit: false,
      carType: [
        {
          value: '选项1',
          label: '集卡'
        },
        {
          value: '选项2',
          label: '货车'
        }
      ],
      carCategory: [
        {
          value: '选项1',
          label: '自有'
        },
        {
          value: '选项2',
          label: '挂靠'
        }
      ]
    }
  },
  methods: {
    clearForm() {
      return {
        resourceNo: '',
        plateNumber: '',
        typeId: '',
        typeName: '',
        typeCode: '',
        categoryId: '',
        categoryName: '',
        categoryCode: '',
        teu: '',
        weight: '',
        terminalId: '',
        terminalName: '',
        orgId:
          this.$store.state.user.currentUser.org &&
          this.$store.state.user.currentUser.org.id,
        orgName:
          this.$store.state.user.currentUser.org &&
          this.$store.state.user.currentUser.org.name,
        deptId: '',
        deptName: '',
        valid: true,
        resourceDescribe: '',
        loadNum: '',
        code: '',
        name: ''
      }
    },
    // 保存
    handleSubmit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.isEdit ? this.handleToEdit() : this.handleToAdd()
        } else {
          this.$message({
            message: '请检查表单',
            type: 'error'
          })
        }
      })
    },
    // 新增
    handleToAdd() {
      addJobVehicle(this.form).then(res => {
        this.$message({ message: '新增成功!', type: 'success' })
        this.dialogForm = false
        this.$emit('load')
      })
    },
    // 编辑
    handleToEdit() {
      updateJobVehicle(this.form.id, this.form).then(res => {
        this.$message({ message: '编辑成功!', type: 'success' })
        this.dialogForm = false
        this.$emit('load')
      })
    },
    handleCllx(v) {
      if (v === 'JOB_CLLX_HC') {
        this.form.teu = 0
      }
      this.form.typeCode = v
    }
  },
  watch: {
    dialogForm(bool) {
      if (!bool) {
        this.$refs.form.resetFields()
        this.isEdit = false
        this.form = this.clearForm()
        this.$emit('clear')
      }
    }
  }
}
</script>

<style scoped>
</style>
